<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <cost-plan v-bind="modalProps" v-model="model.departIds" />
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction, postFormAction } from '@/api/manage'
  import costPlan from './costPlan'

  export default {
    name: 'LogisticsHistoricalQuotationForm',
    mixins:[],
    components: {
      costPlan
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      },
    },
    data () {
      return {
        model:{},
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/logistics/sales/logisticsSalesPrice/add",
          edit: "/logistics/sales/logisticsSalesPrice/edit",
          queryById: "/logistics/sales/logisticsSalesPrice/queryById",
          queryLatestVersion: '/logistics/sales/logisticsSalesPrice/queryLatestVersion',
          list: "/logistics/sales/logisticsSalesPrice/queryVersionList",
          delete: "/logistics/sales/logisticsSalesPrice/delete",
          assignDepart: "/logistics/sales/logisticsSalesPrice/assignDepart"
        },
        modalProps: {
          modalPropsCustom: true, //自定义，区分已有业务
          columns: [
            {
              align: "center",
              dataIndex: "departName",
              title: "客户名称",
              width: "25%",
              isShow: true //是否在已选中中显示
            },
            {
              align: "center",
              dataIndex: "orgCode",
              title: "客户ID",
              width: "25%",
              isShow: true //是否在已选中中显示
            },
            {
              align: "center",
              dataIndex: "departLevel_dictText",
              title: "客户级别",
              width: "25%",
              isShow: true //是否在已选中中显示
            },
            {
              align: "center",
              dataIndex: "groupId_dictText",
              title: "客户分组",
              width: "25%",
              isShow: true //是否在已选中中显示
            }
          ],
          listUrl: "/sys/sysDepart/list",
          multiple: true,
          queryParamConfig: {},
          queryConfig: [
            {key: 'departName', label: '客户名称'},
            {key: 'departLevel', label: '客户级别', dictCode: 'merchant_level'},
            {key: 'groupId', label: '客户分组', dictCode: 'hz_sys_merchant_group,name,id,system'},
          ]
        },
      }
    },
    computed: {
      formDisabled() {
        return this.disabled
      },
    },
    created () {
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      submitForm () {
        if(!this.model.departIds){
          this.$message.warning('请选择客户');
          return;
        }
        let params = {
          departIds: this.model.departIds,
          code: this.model.code
        }
        postFormAction(this.url.assignDepart, params).then((res) => {
          if(res.success){
            this.$message.success(res.message);
            this.$emit('ok');
          }else{
            this.$message.warning(res.message);
          }
        })
      },
    }
  }
</script>

<style scoped lang="less">
.ant-checkbox-wrapper{
  height: 40px;
  line-height: 40px;
}
/deep/.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active{
  border-color: #1890FF;
  border-bottom: 1px solid #fff;
  background: rgba(24,144,255, 0.1);
}
/deep/.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab{
  border-color: #1890FF;
  border-bottom: 1px solid #fff;
  color: #1890FF;
}
</style>